﻿<p>
    This example shows how to databind Telerik Menu for ASP.NET MVC.
</p>
<p>
    The required steps are:
</p>
<ol>
    <li>Pass an <strong>IEnumerable&lt;T&gt;</strong> to the view:
    <pre class="prettyprint">
public ActionResult DataBindingToModel()
{
    NorthwindDataContext northwind = new NorthwindDataContext();
    return View(northwind.Categories);
}
    </pre>
    </li>
    <li>
        Pass the collection as the first parameter of the <strong>BindTo</strong> method. The second parameter is an
        <strong>Action&lt;NavigationBindingFactory&lt;MenuItem&gt;&gt;</strong> which is used to define mappings 
        between objects and <strong>MenuItem</strong>.<br />
        The <em>For&lt;T&gt;</em> method is used to configure the binding.
        The <em>ItemDataBound</em> method maps properties of <strong>T</strong> to <strong>MenuItem</strong>.
        Use the <em>Children</em> method to return the children of <strong>T</strong> (required to create child menu items).
        <br />
        Here is a menu declaration showing how to bind the component to IEnumerable&lt;Category&gt;
        <pre class="prettyprint">
&lt;%= Html.Telerik().Menu()
        .Name("Menu")
        <em>.BindTo(Model, mappings => 
        {
            mappings.For&lt;Category&gt;(binding => binding
                    .ItemDataBound((item, category) =>
                    {
                        item.Text = category.CategoryName;
                    })
                    .Children(category => category.Products));
            mappings.For&lt;Product&gt;(binding => binding
                    .ItemDataBound((item, product) =>
                    {
                        item.Text = product.ProductName;
                    }));
        })</em>
%&gt;
        </pre>
    </li>
</ol>